@red: #e93030;
@green: #009900;
@blue: #4295f2;
@orange: #ff801a;
@border: #eee;
@gray: #999;
@tabGray: #666;
@bg: #f5f5f5;

@font-face {
  font-family: 'DIN';
  src: url('//s.thsi.cn/css/m/fonts/dinstock.ttf');
}

.red {
  color: @red !important;
}

.green {
  color: @green !important;
}

.bg {
  background: #fff;
}

.bold {
  font-weight: 700;
}

.set_px(@css_name, @px_num, @dpr: 4) when (@dpr > 0) {
  .set_px(@css_name, @px_num, (@dpr - 1));

  [data-dpr='@{dpr}'] & {
    @{css_name}: unit(@dpr* @px_num, px);
  }
}

.set_px2(@css_name, @px_num1, @px_num2, @dpr: 4) when (@dpr > 0) {
  .set_px2(@css_name, @px_num1, @px_num2, (@dpr - 1));

  [data-dpr='@{dpr}'] & {
    @{css_name}: unit(@dpr* @px_num1, px) unit(@dpr* @px_num2, px);
  }
}
.height20 {
  height: 0.2rem;
  width: 100%;
  background: @bg;
}
//问答模块
.ques-and-ans{
  padding: .32rem .36rem .16rem .32rem;
  .leaderLoading{
    height: 2rem;
    text-align: center;
    line-height: 2rem;
    .loading-img{
      width: .4rem;
      height: .4rem;
    }
  }
  .qa-header{
    display: flex;
    align-items: center;
    margin-bottom: .32rem;
    justify-content: space-between;
    .qa-tip{
      font-weight: bold;
      line-height: .48rem;
      font-size: .34rem;
      color: #323232;
    }
    .qa-lookall{
      font-size: .26rem;
      line-height: .37rem;
      color: #cccccc;
      .arrow-icon{
        width: auto;
        height: .24rem;
        margin-top: -.06rem;
        margin-left: .14rem;
      }
    }
  }
  .ques-wrap{
    color: #323232;
    .home-ques{
      line-height: .4rem;
      margin-bottom: .16rem;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}



//上三角形
.triangleUp(@w: 4.5, @color: #ccc) {
  display: inline-block;
  width: 0;
  height: 0;
  border-top-width: 0;
  .set_px(border-left-width, @w);
  .set_px(border-right-width, @w);
  .set_px(border-bottom-width, @w);
  border-style: solid;
  border-color: transparent transparent @color;
}

//旋转
.rotate(@angle) {
  transform: rotate(@angle);
  -webkit-transform: rotate(@angle);
}

//下三角形
.triangleDown(@w: 4.5, @color: #ccc) {
  .triangleUp(@w, @color: #ccc);
  .rotate(180deg);
}

//右三角形
.triangleLeft(@w: 4.5, @color: #ccc) {
  .triangleUp(@w, @color: #ccc);
  .rotate(90deg);
}

.border(@color: @border) {
  border-bottom: solid 1px @color;
}

// 设置图片背景
.bgimg(@url) {
  background: url(@url) no-repeat;
  background-size: 100% 100%;
}

// 根据位置设置图片背景
.bgimgpos(@url, @left, @top, @w, @h) {
  background: url(@url);
  background-size: @w @h;
  background-position: @left @top;
}

.bgimgpos2(@url, @left, @top, @w, @h) {
  background: url(@url);
  .set_px2(background-size, @w, @h);
  .set_px2(background-position, @left, @top);
}

/* 父元素-flex容器 */
.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
}

/* 父元素-纵向排列（主轴） */
.flex-v {
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  flex-direction: column;
}

/* 父元素-竖直居中（主轴是横向才生效） */
.flex-vc {
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
}

/* 父元素-水平居中（主轴是横向才生效） */
.flex-hc {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}

/* 子元素-平均分栏 */
.flex1 {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  flex: 1;
}

/* 子元素-两边靠 */
.flex-sb {
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}

#vuewrap {
  background: #fff;
  &.marginTop{
    margin-top: 0.75rem;
  }
  #canvas {
    width: 2.7rem;
    height: 1.8rem;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
  }
  .marquee{
    padding: 0 0.3rem;
    background: #d1e3fb;
    height: 0.72rem;
    line-height: 0.72rem;
    position: fixed;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 100;
    .box {
      float: left;
      display: block;
      position: relative;
      height: 0.72rem;
      width: 100%;
      overflow: hidden;
    
      .list {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        color: @blue;
    
        li {
          height: 0.72rem;
          line-height: 0.72rem;
          font-size: 0.25rem;
          text-overflow: ellipsis;
          white-space: nowrap;
          overflow: hidden;
        }
      }
    
      .top {
        -webkit-transition: all 0.5s;
        transition: all 0.5s;
        margin-top: -0.72rem;
      }
    }
    .close{
      display: inline-block;
      width: .2rem;
      height: .2rem;
      // background: url(../images/icon-share-close.png) no-repeat;
      .bgimg("../images/update-close.png");
      position: absolute;
      right: 0.32rem;
      top: 50%;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
    }
  }
  .iwencai {
    width: 100%;
    height: 1rem;
    z-index: 100;
    position: fixed;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    padding: 0 0.3rem;
    background: #ffffff;
    border-top: solid 1px #eee;
    bottom: 0.99rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    .logo1 {
      width: 0.52rem;
      height: 0.52rem;
      .bgimg('../images/iwencai.png');
    }
   .iwencai_input_box {
    flex: 1;
    margin-left: 0.2rem;
    background: #F7F9FF;
    border-radius: 0.35rem;
    padding: 0rem 0.28rem;
    height: 0.72rem;
    overflow: hidden;
    .ask-list {
      transition: all 1s;
    }
    .ask-list > div {
      height: 0.72rem;
      line-height: 0.72rem;
      font-size: 0.3rem;
      color: rgba(0,0,0,0.85);
      letter-spacing: 0;
      font-weight: 400;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      text-align: left;
    }
  }
 }
  .tab {
    .flex;
    .flex-sb;
    .flex-vc;
    z-index: 100;
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    height: 0.99rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff;
    text-align: center;
    padding: 0 0.3rem;

    .item {
      p {
        color: @tabGray;
        font-size: 0.24rem;
      }
    }

    .item:nth-of-type(1) {
      span {
        width: 0.4rem;
        height: 0.36rem;
        display: inline-block;
        .bgimg('../images/tab-1.png');
      }

      .active {
        .bgimg('../images/tab-1-active.png');
      }

      .active2 {
        color: @red;
      }
    }

    .item:nth-of-type(2) {
      span {
        display: inline-block;
        width: 0.37rem;
        height: 0.36rem;
        .bgimg('../images/tab-2.png');
      }

      .active {
        .bgimg('../images/tab-2-active.png');
      }

      .active2 {
        color: @red;
      }
    }

    .item:nth-of-type(3) {
      span {
        width: 0.39rem;
        height: 0.39rem;
        display: inline-block;
        .bgimg('../images/tab-3.png');
      }

      .active {
        .bgimg('../images/tab-3-active.png');
      }

      .active2 {
        color: @red;
      }
    }

    .item:nth-of-type(4) {
      span {
        width: 0.36rem;
        height: 0.36rem;
        display: inline-block;
        .bgimg('../images/tab-4.png');
      }

      .active {
        .bgimg('../images/tab-4-active.png');
      }

      .active2 {
        color: @red;
      }
    }
  }

  .height68 {
    height: 0.7rem;
    width: 100%;
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
    z-index: 100;
  }

  .refreshbtn {
    width: 0.94rem;
    height: 0.94rem;
    position: fixed;
    z-index: 150;
    right: 0.32rem;
    bottom: 1.62rem;
    .bgimgpos('../images/icon-other.png', -0.85rem, -0.05rem, 1.84rem, 1.04rem);
  }

  .dot3 {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  .limitSummary {
    .weChatBlock{
      height: 0.96rem;
      .weChat{
        height: 0.96rem;
        background-color: #ffffff;
        display: flex;
        align-items: center;
        padding: 0 0.3rem;
        box-sizing: border-box;
        position: relative;
        .weChatIcon{
          width: 0.44rem;
          height: 0.44rem;
          background-image: url('../images/weChat.png');
          background-size: 100% 100%;
          margin-right: 0.16rem;
        }
        .more{
          width: 0.12rem;
          height: 0.20rem;
          position: absolute;
          right: 0.3rem;
          background-image: url('../images/forward.png');
          background-size: 100% 100%;
        }
      }
    }
    .limitOverview,
    .yesterdayLimitup,
    .potentialStock,
    .marketLeader,
    .conceptualTop3,
    .flexibleStock {
      .title {
        height: 0.7rem;
        line-height: 0.7rem;
        margin: 0 0.3rem;
        .border;

        h3 {
          font-size: 0.28rem;
          color: #323232;
          display: inline-block;
          .bold;

          span {
            display: inline-block;
          }

          &:before {
            content: '';
            display: inline-block;
            height: 0.25rem;
            width: 0.05rem;
            margin-right: 0.1rem;
            background: @red;
            vertical-align: middle;
          }
        }

        p {
          font-size: 0.24rem;
          color: @blue;
          float: right;

          i {
            margin-left: 0.1rem;
            width: 0.12rem;
            height: 0.2rem;
            display: inline-block;
            vertical-align: middle;
            .bgimgpos('../images/icon-all.png', -0.05rem, -0.05rem, 4.67rem, 0.86rem);
          }
        }

        ins {
          color: @gray;
          float: right;
          font-size: 0.24rem;
        }

        .info {
          .set_px(width, 15);
          .set_px(height, 15);
          display: inline-block;
          vertical-align: middle;
          margin-left: 0.1rem;
          .bgimgpos2('../images/icon-all.png', -28, -2, 234, 43.5);
        }
      }

      .height20 {
        height: 0.2rem;
        width: 100%;
        background: @bg;
      }

      .loading {
        width: 100%;
        height: 3.14rem;
        background: #fff;
        font-size: 0.26rem;
        position: relative;

        img {
          width: 0.4rem;
          height: 0.4rem;
          text-align: center;
          position: absolute;
          left: 50%;
          top: 50%;
          -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
        }
      }
    }

    .potentialStock {
      .detail {
        .shadow {
          box-shadow: 0.12rem 0.06rem 0.12rem 0 rgba(0, 0, 0, 0.06);
        }

        .replaceShadow {
          border-right: solid 1px @border;
        }

        .list-r {

          .titleWrap,
          .stockWrap {
            width: 10rem;
          }

          .titleWrap {
            .rel-1 {
              width: 16%;
            }

            .rel-2 {
              width: 16%;
            }

            .rel-3 {
              width: 18%;
            }

            .rel-4 {
              width: 20%;
            }

            .rel-5 {
              width: 13%;
            }

            .rel-6 {
              width: 17%;
            }
          }

          .stockWrap {
            .stock {
              .rel-1 {
                width: 16%;
              }

              .rel-2 {
                width: 16%;
              }

              .rel-3 {
                width: 18%;
              }

              .rel-4 {
                width: 20%;
              }

              .rel-5 {
                width: 13%;
              }

              .rel-6 {
                width: 17%;
              }
            }
          }
        }
      }

      .detail {
        padding: 0 0.25rem;
        position: relative;

        .smallTriangle {
          position: absolute;
          right: 0.08rem;
          top: 0.3rem;
          .triangleLeft;
        }

        .list-l {
          float: left;
          width: 23.75%;
          -webkit-box-sizing: border-box;
          box-sizing: border-box;

          .titleWrap {
            width: 100%;

            .table {
              height: 0.72rem;
              .border;

              li {
                text-align: left;
                line-height: 0.24rem;
                float: left;
                margin: 0.24rem 0;
                font-size: 0.26rem;
                color: @gray;

                span {
                  height: 0.24rem;
                  line-height: 0.24rem;
                  float: left;
                }
              }
            }
          }

          .stockWrap {
            width: 100%;

            .stock {
              height: 0.96rem;
              .border;

              li {
                width: 100%;
                float: left;
                font-size: 0.32rem;
                height: 0.96rem;
                line-height: 0.96rem;
                text-align: right;
              }

              li:nth-of-type(1) {
                text-align: left;
                position: relative;

                .name {
                  position: absolute;
                  height: 0.3rem;
                  line-height: 0.3rem;
                  width: 100%;
                  display: inline-block;
                  left: 0;
                  top: 0.18rem;
                }

                .code {
                  position: absolute;
                  height: 0.24rem;
                  line-height: 0.24rem;
                  width: 100%;
                  font-size: 0.24rem;
                  color: @gray;
                  display: inline-block;
                  left: 0;
                  bottom: 0.18rem;
                }
              }

              &:last-child {
                border-bottom: 0;
              }
            }
          }
        }

        .list-r {
          width: 76.25%;
          -webkit-overflow-scrolling: touch;
          overflow: scroll;
          float: right;

          &::-webkit-scrollbar {
            display: none;
          }

          .titleWrap {
            .table {
              width: 100%;
              height: 0.72rem;
              font-size: 0.26rem;
              color: @gray;
              .border;

              li {
                text-align: left;
                line-height: 0.24rem;
                float: left;
                margin-top: 0.24rem;
                margin-bottom: 0.24rem;
                font-size: 0.26rem;

                span {
                  height: 0.24rem;
                  line-height: 0.24rem;
                  float: right;
                }
              }

              .rel {
                .triangle {
                  position: relative;
                  width: 0.14rem;
                  height: 0.26rem;
                  margin-left: 0.08rem;
                  box-sizing: border-box;
                  float: right;

                  .up,
                  .down {
                    position: absolute;
                  }

                  .up {
                    top: 0.02rem;
                    left: 0;
                    .triangleUp;
                  }

                  .down {
                    left: 0;
                    bottom: 0.02rem;
                    .triangleDown;
                  }

                  .active {
                    border-color: transparent transparent #e93030;
                  }
                }
              }
            }
          }

          .stockWrap {
            .stock {
              height: 0.96rem;
              .border;

              .hq {
                font-size: 0.32rem;
                font-family: 'DIN';
              }

              .reason {
                font-size: 0.3rem;
                .dot3;
              }

              li {
                float: left;
                font-size: 0.32rem;
                height: 0.96rem;
                line-height: 0.96rem;
                text-align: right;
              }

              &:last-child {
                border-bottom: 0;
              }
            }
          }
        }
      }

      .more {
        border-top: solid 1px @border;
        height: 0.78rem;
        line-height: 0.78rem;
        text-align: center;
        font-size: 0.28rem;
        color: @blue;
      }

      .empty {
        width: 100%;
        height: 3.14rem;
        line-height: 3.14rem;
        background: #fff;
        font-size: 0.26rem;
        text-align: center;
      }
    }

    .marketLeader {
      .detail {
        .shadow {
          box-shadow: 0.12rem 0.06rem 0.12rem 0 rgba(0, 0, 0, 0.06);
        }

        .replaceShadow {
          border-right: solid 1px @border;
        }

        .list-r {

          .titleWrap,
          .stockWrap {
            width: 6.7rem;
          }

          .titleWrap {
            .rel-1 {
              width: 25%;
            }

            .rel-2 {
              width: 25%;
            }

            .rel-3 {
              width: 25%;
            }

            .rel-4 {
              width: 25%;
            }
          }

          .stockWrap {
            .stock {
              .rel-1 {
                width: 25%;
              }

              .rel-2 {
                width: 25%;
              }

              .rel-3 {
                width: 25%;
              }

              .rel-4 {
                width: 25%;
              }
            }
          }
        }
      }

      .detail {
        padding: 0 0.25rem;
        position: relative;

        .smallTriangle {
          position: absolute;
          right: 0.08rem;
          top: 0.3rem;
          .triangleLeft;
        }

        .list-l {
          float: left;
          width: 23.75%;
          -webkit-box-sizing: border-box;
          box-sizing: border-box;

          .titleWrap {
            width: 100%;

            .table {
              height: 0.72rem;
              .border;

              li {
                text-align: left;
                line-height: 0.24rem;
                float: left;
                margin: 0.24rem 0;
                font-size: 0.26rem;
                color: @gray;

                span {
                  height: 0.24rem;
                  line-height: 0.24rem;
                  float: left;
                }
              }
            }
          }

          .stockWrap {
            width: 100%;

            .stock {
              height: 0.96rem;
              .border;

              li {
                width: 100%;
                float: left;
                font-size: 0.32rem;
                height: 0.96rem;
                line-height: 0.96rem;
                text-align: right;
              }

              li:nth-of-type(1) {
                text-align: left;
                position: relative;

                .name {
                  position: absolute;
                  height: 0.3rem;
                  line-height: 0.3rem;
                  width: 100%;
                  display: inline-block;
                  left: 0;
                  top: 0.18rem;
                }

                .code {
                  position: absolute;
                  height: 0.24rem;
                  line-height: 0.24rem;
                  width: 100%;
                  font-size: 0.24rem;
                  color: @gray;
                  display: inline-block;
                  left: 0;
                  bottom: 0.18rem;
                }
              }

              &:last-child {
                border-bottom: 0;
              }
            }
          }
        }

        .list-r {
          width: 76.25%;
          -webkit-overflow-scrolling: touch;
          overflow: scroll;
          float: right;

          &::-webkit-scrollbar {
            display: none;
          }

          .titleWrap {
            .table {
              width: 100%;
              height: 0.72rem;
              font-size: 0.26rem;
              color: @gray;
              .border;

              li {
                text-align: left;
                line-height: 0.24rem;
                float: left;
                margin-top: 0.24rem;
                margin-bottom: 0.24rem;
                font-size: 0.26rem;

                span {
                  height: 0.24rem;
                  line-height: 0.24rem;
                  float: right;
                }
              }

              .rel {
                .triangle {
                  position: relative;
                  width: 0.14rem;
                  height: 0.26rem;
                  margin-left: 0.08rem;
                  box-sizing: border-box;
                  float: right;

                  .up,
                  .down {
                    position: absolute;
                  }

                  .up {
                    top: 0.02rem;
                    left: 0;
                    .triangleUp;
                  }

                  .down {
                    left: 0;
                    bottom: 0.02rem;
                    .triangleDown;
                  }

                  .active {
                    border-color: transparent transparent #e93030;
                  }
                }
              }
            }
          }

          .stockWrap {
            .stock {
              height: 0.96rem;
              .border;

              .hq {
                font-size: 0.32rem;
                font-family: 'DIN';
              }

              .reason {
                font-size: 0.3rem;
                .dot3;
              }

              li {
                float: left;
                font-size: 0.32rem;
                height: 0.96rem;
                line-height: 0.96rem;
                text-align: right;
              }

              &:last-child {
                border-bottom: 0;
              }
            }
          }
        }
      }

      .more {
        border-top: solid 1px @border;
        height: 0.78rem;
        line-height: 0.78rem;
        text-align: center;
        font-size: 0.28rem;
        color: @blue;
      }

      .empty {
        width: 100%;
        height: 3.14rem;
        line-height: 3.14rem;
        background: #fff;
        font-size: 0.26rem;
        text-align: center;
      }
    }

    .flexibleStock {
      .detail {
        padding: 0 0.25rem;

        .head {
          height: 0.72rem;
          line-height: 0.72rem;

          li {
            font-size: 0.26rem;
            color: @gray;
            .border;
            float: left;
            width: 25%;
            text-align: right;
          }

          li:nth-of-type(1) {
            text-align: left;
          }
        }
      }

      .table {
        li {
          .border;

          .hq {
            font-size: 0.32rem;
            font-family: 'DIN';
          }

          .pt {
            font-size: 0.3rem;
          }

          .stock,
          .value1,
          .value2,
          .value3 {
            height: 0.96rem;
            line-height: 0.96rem;
            width: 25%;
            float: left;
            text-align: right;
          }

          .stock {
            line-height: normal;
            text-align: left;
            .flex;
            .flex-v;
            .flex-hc;

            .name {
              font-size: 0.32rem;
            }

            .code {
              font-size: 0.24rem;
              color: @gray;
            }
          }

          &:last-child {
            border-bottom: 0;
          }
        }
      }

      .more {
        border-top: solid 1px @border;
        height: 0.78rem;
        line-height: 0.78rem;
        text-align: center;
        font-size: 0.28rem;
        color: @blue;
      }

      .empty {
        width: 100%;
        height: 3.14rem;
        line-height: 3.14rem;
        background: #fff;
        font-size: 0.26rem;
        text-align: center;
      }
    }

    .limitOverview {
      .title{
        margin-top: 0.2rem;
      }
      .detail {
        padding: 0.2rem 0.3rem;
        .flex;
        .flex-sb;
        .flex-vc;

        .item {
          h4 {
            color: @gray;
          }

          p {
            padding-top: 0.05rem;
          }
        }

        .item:nth-of-type(1),
        .item:nth-of-type(2) {
          p {
            font-size: 0.32rem;
            font-family: 'DIN';
          }
        }

        .item:nth-of-type(3) {
          p {
            font-size: 0.24rem;
            color: @blue;

            i {
              margin-left: 0.1rem;
              width: 0.12rem;
              height: 0.2rem;
              display: inline-block;
              vertical-align: middle;
              .bgimgpos('../images/icon-all.png', -0.05rem, -0.05rem, 4.67rem, 0.86rem);
            }
          }
        }
      }
    }

    .yesterdayLimitup {
      .detail {
        padding: 0.3rem 0.3rem 0.4rem;
        position: relative;

        .data {
          width: 60.6%;

          .item {
            float: left;
            padding-right: 0.18rem;

            h4 {
              color: @gray;
              font-size: 0.26rem;
            }

            p {
              padding-top: 0.08rem;
              font-size: 0.32rem;
              font-family: 'DIN';
            }
          }

          .item:nth-of-type(2n) {
            padding-right: 0;
          }

          .item:nth-of-type(1),
          .item:nth-of-type(2) {
            padding-bottom: 0.4rem;
          }
        }

        .flex;
        .flex-sb;
        .flex-vc;

        .meter {
          width: 2.8rem;
          height: 1.8rem;
          margin-bottom: 0.2rem;

          .label {
            width: 2.5rem;
            position: absolute;

            .small {
              color: @green;
              float: left;
            }

            .big {
              color: @red;
              float: right;
            }
          }
        }
      }
    }

    .potentialStock {
      .head {
        li:nth-of-type(1) {
          margin-right: 0.4rem;
        }
      }

      .tipsWrap {
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
        z-index: 666;

        .mask {
          position: fixed;
          left: 0;
          top: 0;
          right: 0;
          bottom: 0;
          background: rgba(0, 0, 0, 0.3);
        }

        .tips {
          background: #fff;
          z-index: 999;
          position: absolute;
          left: 50%;
          top: 50%;
          width: 5.6rem;
          height: 3rem;
          margin-top: -1.7rem;
          margin-left: -2.8rem;
          border-radius: 0.04rem;

          h4 {
            font-size: 0.34rem;
            position: absolute;
            top: 0.3rem;
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
          }

          p {
            font-size: 0.3rem;
            text-align: center;
            margin-top: 1rem;
          }

          span {
            font-size: 0.34rem;
            color: @blue;
            position: absolute;
            bottom: 0;
            width: 100%;
            text-align: center;
            border-top: solid 1px @border;
            line-height: 0.9rem;
            height: 0.9rem;
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
          }
        }
      }
    }

    .conceptualTop3 {
      .detail {
        padding: 0 0.3rem;
        .flex;
        .flex-sb;
        .flex-vc;

        .item {
          border-right: solid 1px #eee;
          -webkit-box-sizing: border-box;
          box-sizing: border-box;
          width: 2.18rem;
          padding: 0.2rem 0;

          p {
            text-align: center;
          }

          .value1 {
            font-size: 0.26rem;

            i {
              font-family: 'DIN';
            }
          }

          .value2 {
            .bold;
            padding-top: 0.1rem;
            padding-bottom: 0.1rem;
            font-size: 0.3rem;
          }

          .value3 {
            font-size: 0.36rem;
            font-family: 'DIN';
          }
        }

        .item:nth-of-type(3) {
          border-right: 0;
        }
      }

      .empty {
        width: 100%;
        height: 1.84rem;
        line-height: 1.84rem;
        background: #fff;
        font-size: 0.26rem;
        text-align: center;
      }
    }

    .hasOver {
      height: 0.88rem;
      line-height: 0.88rem;
      background: #f5f5f5;
      text-align: center;
      font-size: 0.24rem;
      color: @gray;
      padding-bottom: 0.98rem;
    }
  }

  .limitCompound {
    .head-scroll{
      overflow-x: auto;
      &::-webkit-scrollbar {
        display: none;
      }
      .compoundTag {
        height: 0.8rem;
        width: 10.5rem;
        line-height: 0.8rem;
        font-size: 0.28rem;
        border-bottom: solid 1px #eee;
        color: @tabGray;
        .flex;
        .flex-sb;
        .flex-vc;

        li {
          width: 1.5rem;
          text-align: center;
        }

        .active {
          color: @red;
        }
      }

      .activeBorder {
        height: 0.04rem;
        width: 10.5rem;
        overflow: auto;
        background: #fff;
        position: relative;
        top: -0.02rem;

        .line {
          background: #e93030;
          height: 0.04rem;
          width: 1.5rem;
        }
      }

    }
      .detail {
        margin-bottom: 1rem;

      .type1,
      .type2 {
        .calendar {
          width: 100%;

          .calendar-title {
            padding: 0 0.3rem;
            height: 0.72rem;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            width: 100%;
            background: #fbfbfb;
            position: relative;
            .border;

            .limit-detail {
              font-size: 0.24rem;
              color: @blue;
              position: absolute;
              top: 50%;
              right: 0.3rem;
              -webkit-transform: translateY(-50%);
              transform: translateY(-50%);

              &:after {
                content: '';
                display: inline-block;
                width: 0.12rem;
                height: 0.2rem;
                vertical-align: middle;
                margin-left: 0.1rem;
                .bgimgpos('../images/icon-all.png', -0.05rem, -0.05rem, 4.67rem, 0.86rem);
              }
            }

            .backtoday {
              position: absolute;
              top: 50%;
              right: 0.3rem;
              -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
              color: @blue;
              font-size: 0.24rem;
            }

            .date {
              font-size: 0.28rem;
              color: #323232;
              position: absolute;
              top: 50%;
              left: 0.3rem;
              -webkit-transform: translateY(-50%);
              transform: translateY(-50%);

              &:before {
                content: '';
                display: inline-block;
                width: 0.32rem;
                height: 0.29rem;
                margin-right: 0.16rem;
                vertical-align: middle;
                .bgimg('../images/icon-calendar.png');
              }
            }
          }

          .calendar-week {
            width: 100%;
            height: 0.7rem;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;

            .item {
              float: left;
              height: 0.7rem;
              font-size: 0.28rem;
              line-height: 0.7rem;
              width: 14.2857%;
              text-align: center;

              &.r,
              &.l {
                color: @gray;
              }
            }
          }

          .calendar-date,
          .calendar-date-week {
            width: 100%;
            overflow: hidden;

            .item {
              float: left;
              height: 0.4rem;
              width: 0.4rem;
              font-size: 0.28rem;
              line-height: 0.4rem;
              margin: 1.09125% 4.365%;
              text-align: center;
              color: @gray;

              &.item-curMonth {
                color: #323232;
              }

              &.item-curDay {
                background: #f5f5f5;
                border-radius: 50%;
              }

              &.item-curSelDay {
                color: #fff;
                border-radius: 50%;
                background-color: #e93030;
              }
            }
          }

          .calendar-date {
            height: 100%;
            overflow: hidden;
          }

          .foldarea {
            text-align: center;

            .fold {
              padding-bottom: 0.1rem;
              display: inline-block;
              width: 0.2rem;
              height: 0.12rem;
              .bgimgpos('../images/icon-all.png', -0.27rem, -0.05rem, 4.67rem, 0.86rem);
            }
          }

          .tips {
            display: none;
            padding: 0.22rem 0 0.34rem;
            font-size: 0.24rem;
            color: @gray;
            text-align: center;
            height: 0.22rem;
            line-height: 0.22rem;
          }
        }

        .alert {
          background: #f5f5f5;
          line-height: 1;
          font-size: 0.23rem;
          padding-top: 0.32rem;
          padding-bottom: 0.16rem;
          text-align: center;
          color: #fea31e;
        }
      }

      .type1 {
        .allBorad {
          background: #fff;

          .board {
            h4 {
              padding: 0 0.25rem;
              height: 0.65rem;
              line-height: 0.65rem;
              .border;
              .bold;
              font-size: 0.28rem;

              span:nth-of-type(1) {
                padding-right: 0.2rem;
              }
            }

            .item {
              li {
                float: left;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                padding: 0.25rem;
                width: 50%;

                .base {
                  span {
                    display: inline-block;
                    vertical-align: middle;
                  }

                  .name {
                    font-size: 0.3rem;
                  }

                  .label {
                    font-size: 0.2rem;
                    height: 0.19rem;
                    line-height: 0.19rem;
                    padding: 0.05rem 0.06rem;
                    background: rgba(233, 48, 48, 0.1);
                  }

                  .r_block {
                    float: right;
                    margin-top: 0.06rem;
                  }
                }

                .flow {
                  color: @gray;
                  font-size: 0.24rem;
                  padding-top: 0.15rem;
                  padding-bottom: 0.15rem;

                  span {
                    padding-left: 0.15rem;

                    ins {
                      color: #323232;
                      font-family: 'DIN';
                    }
                  }

                  .tip {
                    float: right;
                    line-height: 1;
                    margin-top: 0.1rem;
                    font-size: 0.24rem;
                  }
                }

                .cause {
                  color: @gray;
                  font-size: 0.24rem;
                  padding-bottom: 0.15rem;

                  span {
                    color: #323232;
                    padding-left: 0.15rem;
                  }
                }

                .limit {
                  color: @gray;
                  font-size: 0.24rem;

                  span {
                    padding-left: 0.15rem;
                    font-size: 0.32rem;
                    font-family: 'DIN';
                    display: inline-block;
                  }
                }
              }

              li:nth-of-type(2n-1) {
                border-right: solid 1px #eee;
                border-bottom: solid 1px #eee;
              }

              li:nth-of-type(2n) {
                border-bottom: solid 1px #eee;
              }
            }

            .height13 {
              height: 0.13rem;
              background: #f5f5f5;
              width: 100%;
            }
          }

          .emptyData {
            width: 100%;
            height: 4.22rem;
            position: relative;

            p {
              position: absolute;
              left: 50%;
              top: 50%;
              text-align: center;
              width: 100%;
              font-size: 0.26rem;
              -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
            }
          }
        }
      }

      .type2 {
        .allLimit {
          .limit {
            h4 {
              height: 0.62rem;
              line-height: 0.62rem;
              .bold;
              .border;
              font-size: 0.28rem;
              padding: 0 0.3rem;

              span:nth-of-type(2) {
                padding-left: 0.1rem;
                padding-right: 0.25rem;
              }
            }

            .item {
              li {
                border-right: solid 1px #eee;
                border-bottom: solid 1px #eee;
                float: left;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                width: 33.33%;
                padding: 0.26rem;

                .base {
                  position: relative;

                  span {
                    display: inline-block;
                    vertical-align: middle;
                  }

                  .name {
                    font-size: 0.3rem;
                    float: left;
                    margin-right: 0.05rem;
                  }

                  .label {
                    font-size: 0.2rem;
                    float: left;
                    margin-top: 0.1rem;
                    height: 0.19rem;
                    line-height: 0.19rem;
                    padding: 0.05rem 0.06rem;
                    background: rgba(233, 48, 48, 0.1);
                  }
                }

                .board {
                  font-size: 0.24rem;
                  padding-top: 0.2rem;

                  span {
                    display: inline-block;
                    line-height: 1;
                  }

                  .number {
                    padding-right: 0.15rem;
                    border-right: solid 1px #eee;
                  }

                  .tip {
                    padding-left: 0.15rem;
                  }
                }
              }

              li:nth-of-type(3n) {
                border-right: 0;
              }
            }

            .height17 {
              height: 0.17rem;
              background: #f5f5f5;
              width: 100%;
            }
          }

          .emptyData {
            width: 100%;
            height: 4.22rem;
            position: relative;

            p {
              position: absolute;
              left: 50%;
              top: 50%;
              text-align: center;
              width: 100%;
              font-size: 0.26rem;
              -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
            }
          }
        }
      }

      .type3 {
        .list {
          .list-r {

            .titleWrap,
            .stockWrap {
              width: 14.75rem;
            }

            .titleWrap {
              .rel {
                width: 11%;
              }

              .rel-7 {
                width: 12%;
              }
            }

            .stockWrap {
              .stock {
                li {
                  width: 11%;
                }

                .rel-7 {
                  width: 12%;
                }
              }
            }
          }
        }
      }

        .type4 {
          .list {
            .list-r {

              .titleWrap,
              .stockWrap {
                width: 14.5rem;
              }

              .titleWrap {
                .rel {
                  width: 12.2%;
                }
                .rel-last {
                  width: 14.6%;
                }
              }

              .stockWrap {
                .stock {
                  li {
                    width: 12.2%;
                  }

                  .rel-last {
                    width: 14.6%;
                  }
                }
              }
            }
          }
        }

      .type5 {
        .list {
          .list-r {

            .titleWrap,
            .stockWrap {
              width: 18.8rem;
            }

            .titleWrap {
              .rel {
                width: 8.59%;
              }

              .rel-6 {
                width: 11.345%;
              }
            }

            .stockWrap {
              .stock {
                li {
                  width: 8.59%;
                }

                .rel-6 {
                  width: 11.345%;
                }
              }
            }
          }
        }
      }

      .type3,
      .type4,
      .type5 {
        .alert {
          background: #f5f5f5;
          line-height: 1;
          font-size: 0.23rem;
          padding-top: 0.32rem;
          padding-bottom: 0.16rem;
          text-align: center;
          color: #fea31e;
        }

        .shadow {
          box-shadow: 0.12rem 0.06rem 0.12rem 0 rgba(0, 0, 0, 0.06);
        }

        .replaceShadow {
          border-right: solid 1px @border;
        }

        .empty {
          img {
            width: 2.22rem;
            height: 1.93rem;
            display: inline-block;
            margin-top: 0.3rem;
            margin-bottom: 0.2rem;
          }

          p {
            padding-bottom: 0.2rem;
          }

          font-size: 0.32rem;
          text-align: center;
        }

        .loading {
          width: 100%;
          height: 3.14rem;
          background: #fff;
          font-size: 0.26rem;
          position: relative;

          img {
            width: 0.4rem;
            height: 0.4rem;
            display: inline-block;
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: rotate(-50%, -50%);
            transform: rotate(-50%, -50%);
          }
        }

        .list {
          padding: 0 0.25rem;
          margin-bottom: 1.1rem;
          position: relative;

          .smallTriangle {
            position: absolute;
            right: 0.08rem;
            top: 0.3rem;
            .triangleLeft;
          }

          .list-l {
            float: left;
            width: 25.75%;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;

            .titleWrap {
              width: 100%;

              .title {
                height: 0.72rem;
                border-bottom: solid 1px @border;

                li {
                  text-align: left;
                  line-height: 0.24rem;
                  float: left;
                  margin: 0.24rem 0;
                  font-size: 0.26rem;
                  color: @gray;

                  span {
                    height: 0.24rem;
                    line-height: 0.24rem;
                    float: left;
                  }
                }
              }
            }

            .stockWrap {
              width: 100%;

              .stock {
                height: 0.96rem;
                border-bottom: solid 1px @border;

                li {
                  width: 100%;
                  float: left;
                  font-size: 0.32rem;
                  height: 0.96rem;
                  line-height: 0.96rem;
                  text-align: right;
                }

                li:nth-of-type(1) {
                  text-align: left;
                  position: relative;

                  .name {
                    position: absolute;
                    height: 0.3rem;
                    line-height: 0.3rem;
                    width: 100%;
                    display: inline-block;
                    left: 0;
                    top: 0.18rem;
                  }

                  .code {
                    position: absolute;
                    height: 0.24rem;
                    line-height: 0.24rem;
                    width: 100%;
                    font-size: 0.24rem;
                    color: @gray;
                    display: inline-block;
                    left: 0;
                    bottom: 0.18rem;
                  }
                }
              }
            }
          }

          .list-r {
            width: 74.25%;
            -webkit-overflow-scrolling: touch;
            overflow: scroll;
            float: right;

            &::-webkit-scrollbar {
              display: none;
            }

            .titleWrap {
              .title {
                width: 100%;
                height: 0.72rem;
                font-size: 0.26rem;
                color: @gray;
                border-bottom: solid 1px #eee;

                li {
                  text-align: left;
                  line-height: 0.24rem;
                  float: left;
                  margin-top: 0.24rem;
                  margin-bottom: 0.24rem;
                  font-size: 0.26rem;

                  span {
                    height: 0.24rem;
                    line-height: 0.24rem;
                    float: right;
                  }
                }

                .rel {
                  .triangle {
                    position: relative;
                    width: 0.14rem;
                    height: 0.26rem;
                    margin-left: 0.08rem;
                    box-sizing: border-box;
                    float: right;

                    .up,
                    .down {
                      position: absolute;
                    }

                    .up {
                      top: 0.02rem;
                      left: 0;
                      .triangleUp;
                    }

                    .down {
                      left: 0;
                      bottom: 0.02rem;
                      .triangleDown;
                    }

                    .active {
                      border-color: transparent transparent #e93030;
                    }
                  }
                }
              }
            }

            .stockWrap {
              .stock {
                height: 0.96rem;
                border-bottom: solid 1px @border;

                .hq {
                  font-size: 0.32rem;
                  font-family: 'DIN';
                }

                .fontsize30 {
                  font-size: 0.3rem;
                }

                .fontsize28 {
                  font-size: 0.28rem;
                }

                li {
                  float: left;
                  font-size: 0.32rem;
                  height: 0.96rem;
                  line-height: 0.96rem;
                  text-align: right;
                }
              }
            }
          }
        }
      }
    }
  }

  .limitGene {
    margin-bottom: 1rem;

    .searchBox {
      position: fixed;
      left: 0;
      top: 0;
      right: 0;
      z-index: 200;

      .search {
        height: 0.56rem;
        padding: 0.16rem 0.32rem;
        background: #fff;

        .input {
          width: 100%;
          height: 0.56rem;
          position: relative;
          border: 0;
          border-radius: 0.04rem;
          background: #eee;

          .icon-search {
            display: inline-block;
            width: 0.28rem;
            height: 0.28rem;
            position: absolute;
            top: 0.14rem;
            left: 0.18rem;
            .bgimgpos('../images/icon-other.png', -0.05rem, -0.05rem, 1.84rem, 1.04rem);
          }

          input {
            height: 0.32rem;
            width: 4.18rem;
            padding: 0.14rem 0 0.1rem 0.06rem;
            color: rgba(50, 50, 50, 1);
            font-size: 0.28rem;
            line-height: 0.32rem;
            outline: 0;
            display: inline-block;
            border: none;
            background: #eee;
            position: absolute;
            top: 0;
            left: 0.58rem;
            -webkit-appearance: none;
          }

          .icon-close {
            display: inline-block;
            width: 0.32rem;
            height: 0.32rem;
            position: absolute;
            top: 0.14rem;
            right: 0.18rem;
            .bgimg('../images/icon-close.png');
          }
        }

        .insearch {
          width: 5.52rem;
          display: inline-block;
        }

        .cancel {
          height: 0.56rem;
          text-align: right;
          line-height: 0.56rem;
          font-size: 0.28rem;
          position: absolute;
          right: 0.3rem;
          top: 0.16rem;
          padding: 0 0.16rem;
        }
      }

      .height20 {
        height: 0.22rem;
        background: @bg;
        width: 100%;
        position: fixed;
        left: 0;
        top: 0.87rem;
        right: 0;
        bottom: 0;
      }
    }

    .searchList {
      padding: 0 0.3rem;
      padding-top: 0.88rem;

      .tips {
        padding-top: 0.48rem;
        font-size: 0.24rem;
        color: @gray;
        line-height: 0.32rem;
        text-align: justify;
      }

      ul {
        li {
          .border;
          height: 0.8rem;
          line-height: 0.8rem;

          span {
            float: left;
            width: 50%;
            font-size: 0.3rem;
          }

          .code {
            color: #666;
            font-family: 'DIN';
          }
        }
      }

      .empty {
        margin-top: 2.5rem;
        text-align: center;
        font-size: 0.32rem;
        letter-spacing: 0.04rem;
      }
    }

    .geneSelStockTab {
      position: fixed;
      left: 0;
      top: 1.08rem;
      right: 0;
      background: #fff;
      z-index: 200;
      padding: 0 1rem;
      height: 0.8rem;
      line-height: 0.8rem;
      font-size: 0.28rem;
      .flex;
      .flex-sb;
      .flex-vc;

      li {
        width: 1.45rem;
        text-align: center;
      }
    }

    .activeBorder {
      position: fixed;
      top: 1.88rem;
      left: 0;
      right: 0;
      height: 0.04rem;
      overflow: hidden;
      width: 92%;
      margin: 0 auto;
      background: #fff;
      z-index: 300;
      border-bottom: solid 1px #eee;

      .line {
        background: #e93030;
        height: 0.04rem;
        width: 1.45rem;
        position: absolute;
      }

      .left {
        left: 0.7rem;
      }

      .right {
        right: 0.7rem;
      }
    }

    .title {
      position: fixed;
      left: 0;
      top: 1.88rem;
      right: 0;
      background: #fff;
      z-index: 200;
      margin: 0 0.3rem;
      height: 0.72rem;
      font-size: 0.26rem;
      color: @gray;
      border-bottom: solid 1px #eee;

      li {
        text-align: left;
        line-height: 0.24rem;
        float: left;
        margin: 0.24rem 0;
        font-size: 0.26rem;

        span {
          height: 0.24rem;
          line-height: 0.24rem;
          float: left;
        }
      }

      li:nth-of-type(1) {
        width: 25%;
      }

      li:nth-of-type(2) {
        width: 20%;
        margin-left: 5%;
      }

      li:nth-of-type(3) {
        width: 12%;
        margin-left: 13%;
      }

      li:nth-of-type(4) {
        width: 12%;
        margin-left: 13%;
      }

      .rel {
        .triangle {
          position: relative;
          width: 0.14rem;
          height: 0.26rem;
          margin-left: 0.08rem;
          box-sizing: border-box;
          float: left;

          .up,
          .down {
            position: absolute;
          }

          .up {
            top: 0.02rem;
            left: 0;
            .triangleUp;
          }

          .down {
            left: 0;
            bottom: 0.02rem;
            .triangleDown;
          }

          .active {
            border-color: transparent transparent #e93030;
          }
        }
      }
    }

    .detailWrap {
      overflow: hidden;
      z-index: 50;

      .detail {
        margin-top: 2.62rem;

        div {
          ul {
            .hq {
              font-size: 0.32rem;
              font-family: 'DIN';
            }

            margin: 0 0.3rem;
            height: 0.96rem;
            border-bottom: solid 1px @border;

            li {
              width: 25%;
              float: left;
              font-size: 0.32rem;
              height: 0.96rem;
            }

            li:nth-of-type(1) {
              text-align: left;
              position: relative;

              .name {
                position: absolute;
                height: 0.3rem;
                line-height: 0.3rem;
                width: 100%;
                display: inline-block;
                left: 0;
                top: 0.18rem;
              }

              .code {
                position: absolute;
                height: 0.24rem;
                line-height: 0.24rem;
                width: 100%;
                font-size: 0.24rem;
                color: @gray;
                display: inline-block;
                left: 0;
                bottom: 0.18rem;
              }
            }

            li:nth-of-type(2) {
              text-indent: 5%;
              text-align: right;
              line-height: 0.96rem;
            }

            li:nth-of-type(3),
            li:nth-of-type(4) {
              text-align: right;
              line-height: 0.96rem;
            }
          }

          .loading {
            width: 100%;
            text-align: center;
            font-size: 0.32rem;

            img {
              display: inline-block;
              width: 0.32rem;
              height: 0.32rem;
              vertical-align: middle;
              -webkit-animation: turnround infinite linear 0.5s;
              animation: turnround infinite linear 0.5s;
            }

            span {
              padding-left: 0.1rem;
              display: inline-block;
              vertical-align: middle;
              line-height: 1;
            }
          }

          .empty {
            img {
              width: 2.22rem;
              height: 1.93rem;
              display: inline-block;
              margin-top: 0.3rem;
              margin-bottom: 0.2rem;
            }

            p {
              padding-bottom: 0.2rem;
            }

            font-size: 0.32rem;
            text-align: center;
          }
        }
      }
    }

    .refresh {
      .refreshbtn;
    }
  }

  .limitMonitor {
    .maxTip {
      height: 0.88rem;
      line-height: 0.88rem;
      text-align: center;
      font-size: 0.24rem;
      color: @gray;
      float: left;
      width: 100%;
    }
    .tipsWrap {
      position: fixed;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      background: rgba(0, 0, 0, 0.3);
      z-index: 666;

      .mask {
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
      }

      .tips {
        background: #fff;
        z-index: 999;
        position: absolute;
        left: 50%;
        top: 50%;
        width: 5.6rem;
        height: 3rem;
        margin-top: -1.7rem;
        margin-left: -2.8rem;
        border-radius: 0.04rem;

        h4 {
          font-size: 0.34rem;
          position: absolute;
          top: 0.3rem;
          left: 50%;
          -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
        }

        p {
          font-size: 0.3rem;
          text-align: center;
          margin-top: 1rem;
        }

        span {
          font-size: 0.34rem;
          color: @blue;
          position: absolute;
          bottom: 0;
          width: 100%;
          text-align: center;
          border-top: solid 1px @border;
          line-height: 0.9rem;
          height: 0.9rem;
          left: 50%;
          -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
        }
      }
    }

    .hxm-search {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      box-sizing: border-box;
      z-index: 10;
    }

    .fixedTab {
      position: fixed;
      top: 1.16rem;
      left: 0;
      width: 100%;
      z-index: 100;
      background: #fff;

      .monitorTag {
        height: 0.8rem;
        width: 100%;
        line-height: 0.8rem;
        font-size: 0.28rem;
        border-bottom: solid 1px #eee;
        color: @tabGray;

        .flex;
        .flex-sb;
        .flex-vc;

        li {
          width: 33.3333%;
          text-align: center;
        }

        .active {
          color: @red;
        }
      }

      .activeBorder {
        height: 0.04rem;
        margin: 0 auto;
        width: 84%;
        overflow: hidden;
        background: #fff;
        position: relative;

        .line {
          background: #e93030;
          height: 0.04rem;
          width: 19.444%;
        }
      }
    }

    // 提醒样式
    .slideBg {
      z-index: 200;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.6);
      position: fixed;
      left: 0;
      top: 0;
      display: none;
      bottom: 0;
    }

    .showSlideBg {
      display: block;
      -webkit-transition: opacity 0.3s;
      transition: opacity 0.3s;
    }

    .slideNav {
      width: 82%;
      height: 100%;
      background: #fff;
      position: fixed;
      z-index: 99;
      top: 0;
      left: -82%;
      z-index: 200;

      .wrap {
        padding-top: 0.55rem;
        padding-left: 0.3rem;
        padding-right: 0.3rem;
        padding-bottom: 0.8rem;
        border-bottom: solid 1px #eee;

        h4 {
          font-size: 0.31rem;
          font-weight: bold;
          line-height: 1;
          padding-bottom: 0.44rem;
        }

        .list {
          li {
            line-height: 1;
            padding-bottom: 0.3rem;
            color: @tabGray;
            font-size: 0.3rem;

            span {
              display: inline-block;
              vertical-align: middle;
            }

            .circle {
              width: 0.44rem;
              height: 0.44rem;
              -webkit-box-sizing: border-box;
              box-sizing: border-box;
              border: solid 1px #c4c4c4;
              border-radius: 50%;
            }

            .checked {
              width: 0.44rem;
              height: 0.44rem;
              .bgimg('../images/icon-checked.png');
            }
          }
        }
      }

      .tips {
        padding: 0.25rem 0.3rem;
        color: #fea31e;
        font-size: 0.26rem;
      }

      .confirm {
        position: absolute;
        bottom: 0;
        left: 0;
        height: 0.96rem;
        line-height: 0.96rem;
        width: 100%;
        color: #fff;
        background: #e93030;
        font-size: 0.3rem;
        text-align: center;
      }
    }

    .slideFloat {
      left: 0;
      -webkit-transition: left 0.3s ease 0s;
      transition: left 0.3s ease 0s;
    }

    .slideFloatback {
      left: -82%;
      -webkit-transition: left 0.3s ease 0s;
      transition: left 0.3s ease 0s;
    }

    // 具体的细节
    .detail {
      position: relative;
      margin-top: 2.04rem;

      .alert {
        width: 2.3rem;
        height: 0.76rem;
        position: absolute;
        left: 0.28rem;
        top: 0.55rem;
        z-index: 100;
        .bgimg('../images/icon-bubble.png');
        opacity: 0.9;
      }

      .loading {
        width: 100%;
        height: 3.14rem;
        background: #fff;
        font-size: 0.26rem;
        position: relative;

        img {
          width: 0.4rem;
          height: 0.4rem;
          text-align: center;
          position: absolute;
          left: 50%;
          top: 50%;
          -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
        }
      }

      .type1 {
        .list {
          .list-r {
            -webkit-overflow-scrolling: touch;
            overflow: scroll;

            .titleWrap,
            .stockWrap {
              width: 9.4rem;
            }

            .titleWrap {
              .rel {
                width: 16.5%;
              }

              li:nth-of-type(1) {
                width: 12%;
              }

              .rel-6 {
                width: 23%;
              }

              .rel-2 {
                width: 16%;
              }
            }

            .stockWrap {
              .stock {
                li {
                  width: 16.5%;
                }

                li:nth-of-type(1) {
                  width: 12%;
                }

                .rel-6 {
                  width: 23%;
                }

                .rel-2 {
                  width: 16%;
                }
              }
            }
          }
        }
      }

      .type2 {
        .list {
          .list-r {
            -webkit-overflow-scrolling: touch;
            overflow: scroll;

            .titleWrap,
            .stockWrap {
              width: 11rem;
            }

            .titleWrap {
              .rel {
                width: 15%;
              }

              .rel-6 {
                width: 20%;
              }
            }

            .stockWrap {
              .stock {
                li {
                  width: 15%;
                }

                .rel-6 {
                  width: 20%;
                }
              }
            }
          }
        }
      }

      .type3 {
        .list {
          .list-r {
            .titleWrap {
              .rel {
                width: 50%;
              }
            }

            .stockWrap {
              .stock {
                li {
                  width: 50%;
                }
              }
            }
          }
        }
      }

      .type1,
      .type2,
      .type3 {
        .shadow {
          box-shadow: 0.12rem 0.06rem 0.12rem 0 rgba(0, 0, 0, 0.06);
        }

        .replaceShadow {
          border-right: solid 1px @border;
        }

        .empty {
          img {
            width: 2.22rem;
            height: 1.93rem;
            display: inline-block;
            margin-top: 0.3rem;
            margin-bottom: 0.2rem;
          }

          p {
            padding-bottom: 0.2rem;
          }

          font-size: 0.32rem;
          text-align: center;
        }

        .list {
          padding: 0 0.25rem;
          margin-bottom: 1.1rem;
          position: relative;

          .smallTriangle {
            position: absolute;
            right: 0.08rem;
            top: 0.3rem;
            .triangleLeft;
          }

          .list-l {
            float: left;
            width: 50%;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;

            .titleWrap {
              width: 100%;

              .title {
                height: 0.72rem;
                border-bottom: solid 1px @border;

                li {
                  text-align: left;
                  line-height: 0.24rem;
                  float: left;
                  width: 50%;
                  margin: 0.24rem 0;
                  font-size: 0.26rem;
                  color: @gray;
                  position: relative;

                  span {
                    height: 0.24rem;
                    line-height: 0.24rem;
                    float: left;
                  }

                  .setting {
                    width: 0.3rem;
                    height: 0.3rem;
                    position: absolute;
                    top: 0;
                    left: 0.6rem;
                    .bgimg('../images/icon-setting.png');
                  }
                }
              }
            }

            .stock-button {
              .stockWrap {
                width: 50%;
                float: right;

                .stock {
                  height: 0.96rem;
                  border-bottom: solid 1px @border;
                  -webkit-box-sizing: border-box;
                  box-sizing: border-box;

                  li {
                    width: 100%;
                    float: left;
                    font-size: 0.3rem;
                    height: 0.96rem;
                    line-height: 0.96rem;
                    text-align: right;
                  }

                  li:nth-of-type(1) {
                    text-align: left;
                    position: relative;

                    .name {
                      position: absolute;
                      height: 0.3rem;
                      line-height: 0.3rem;
                      width: 100%;
                      display: inline-block;
                      left: 0;
                      top: 0.18rem;
                    }

                    .code {
                      position: absolute;
                      height: 0.24rem;
                      line-height: 0.24rem;
                      width: 100%;
                      font-size: 0.24rem;
                      color: @gray;
                      display: inline-block;
                      left: 0;
                      bottom: 0.18rem;
                    }
                  }
                }
              }

              .buttonWrap {
                width: 50%;
                float: left;

                .button {
                  height: 0.96rem;
                  position: relative;
                  border-bottom: solid 1px @border;
                  -webkit-box-sizing: border-box;
                  box-sizing: border-box;

                  li {
                    width: 1rem;
                    top: 50%;
                    left: 0;
                    position: absolute;
                    margin-top: -0.3rem;
                    height: 0.6rem;

                    .animate {
                      -webkit-transition: 0.3s;
                      transition: 0.3s;
                    }

                    span {
                      height: 0.6rem;
                      display: block;
                      position: absolute;
                      background: #ddd;
                      width: 1rem;
                      left: 0;
                      top: 0;
                      border-radius: 0.5rem;
                    }

                    i {
                      width: 0.54rem;
                      height: 0.54rem;
                      position: absolute;
                      top: 50%;
                      .animate;
                      left: 0.03rem;
                      margin-top: unit(-0.54/2, rem);
                      background: #fff;
                      border-radius: 50%;
                    }

                    .active_i {
                      left: 0.43rem;
                      .animate;
                    }

                    .active_span {
                      background: @red;
                      .animate;
                    }
                  }
                }
              }
            }
          }

          .list-r {
            width: 50%;
            float: right;

            &::-webkit-scrollbar {
              display: none;
            }

            .titleWrap {
              .title {
                width: 100%;
                height: 0.72rem;
                font-size: 0.26rem;
                color: @gray;
                border-bottom: solid 1px #eee;

                li {
                  text-align: left;
                  line-height: 0.24rem;
                  float: left;
                  margin-top: 0.24rem;
                  margin-bottom: 0.24rem;
                  font-size: 0.26rem;

                  span {
                    height: 0.24rem;
                    line-height: 0.24rem;
                    float: right;
                  }
                }

                .rel {
                  .triangle {
                    position: relative;
                    width: 0.14rem;
                    height: 0.26rem;
                    margin-left: 0.08rem;
                    box-sizing: border-box;
                    float: right;

                    .up,
                    .down {
                      position: absolute;
                    }

                    .up {
                      top: 0.02rem;
                      left: 0;
                      .triangleUp;
                    }

                    .down {
                      left: 0;
                      bottom: 0.02rem;
                      .triangleDown;
                    }

                    .active {
                      border-color: transparent transparent #e93030;
                    }
                  }
                }
              }
            }

            .stockWrap {
              .stock {
                height: 0.96rem;
                border-bottom: solid 1px @border;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;

                .hq {
                  font-size: 0.3rem;
                  font-family: 'DIN';
                }

                .font28 {
                  font-size: 0.28rem;
                }

                .dot {
                  .dot3;
                }

                li {
                  float: left;
                  font-size: 0.32rem;
                  height: 0.96rem;
                  line-height: 0.96rem;
                  text-align: right;
                }
              }
            }
          }
        }
      }
    }

    .refresh {
      .refreshbtn;
    }
  }
}
.fee-helper-wrap {
  padding-bottom: 1.16rem;
}

.qlg-update-time {
  font-size: .22rem;
  color: #fea31e;
  padding: .32rem .32rem .14rem;
  background-color: #f5f5f5;
}